<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<%@ include file="/pub/head_latest.inc"%>
<link href="${baseURL}/themes/plugin/bootstrap/css/bootstrap.css"
	rel="stylesheet" type="text/css" />
	<link
	href="${baseURL}/themes/plugin/bootstrap-dialog/css/bootstrap-dialog.css"
	rel="stylesheet" type="text/css" />
<link href="${baseURL}/themes/plugin/bootstrapTable/bootstrap-table.css"
	rel="stylesheet" type="text/css" />
	<link href="${baseURL}/css/bootstrap-multiselect.css" rel="stylesheet" type="text/css"/>
	<link href="${baseURL}/themes/blue/css/sys.css" rel="stylesheet"
		type="text/css" />
	<script src="${baseURL}/js/jquerys/jquery-1.12.1.min.js"
		type="text/javascript"></script>
	<script src="${baseURL}/themes/plugin/bootstrap/js/bootstrap.min.js"
		type="text/javascript"></script>
	<script
		src="${baseURL}/themes/plugin/bootstrap-dialog/js/bootstrap-dialog.js"
		type="text/javascript"></script>

	<script
		src="${baseURL}/themes/plugin/bootstrapTable/bootstrap-table.js"
		type="text/javascript"></script>
	<script
		src="${baseURL}/themes/plugin/bootstrapTable/locale/bootstrap-table-zh-CN.min.js"
		type="text/javascript"></script>
		<script src="${baseURL}/js/BT.js" type="text/javascript"></script>
<script src="${baseURL}/themes/plugin/ligerUI_latest/lib/ligerUI/js/core/base.js" type="text/javascript"></script>
<script src="${baseURL}/themes/plugin/ligerUI_latest/lib/ligerUI/js/ligerui.all.js" type="text/javascript"></script>
<script src="${baseURL}/themes/plugin/ligerUI_latest/lib/ligerUI/js/plugins/ligerDialog.js" type="text/javascript"></script>
<script src="${baseURL}/themes/plugin/ligerUI_latest/lib/ligerUI/js/plugins/ligerDateEditor.js" type="text/javascript"></script>
<script src="${baseURL}/js/sdAppFrameworkAddressBook.js" type="text/javascript"></script>
<script src="${baseURL}/js/bootstrap-multiselect.js" type="text/javascript"></script>
<title>模板</title>
<style type="text/css">
#departName, #childsCount {
	color: #0066cc
}
.bootstrap-dialog-message{text-align:center;}
.bootstrap-dialog-message>p{text-align:center;}
.bootstrap-dialog-message>h4{text-align:center;}
.bootstrap-dialog-footer-buttons{text-align:center;}

.btn b.caret {
    margin-left: 10px;
    float: left;
    margin-top:8px;
}

span.multiselect-selected-text{
	float: left;
}
</style>
</head>
<body class="FrameRightBg">
	<div class="FrameRight" id="FrameRightContent">
		<!-- 这里定义了转发进入的TAB对应的菜单ID，也是TAB的属性ID值 -->
		<input type="hidden" name="menuId" id="menuId" value="${param.menuId}" />
		<div class="common-option" style="margin-top: 5px">
			<div class="inner">
				<button id="add" type="button" class="btn btn-icon"
					onclick="FF_AddClickEvent(this)">
					<i class="l-icon l-icon-a fa fa-plus-square-o"></i>新增
				</button>
				<button id="modify" type="button" class="btn btn-icon"
					onclick="FF_ModifyClickEvent(this)">
					<i class="l-icon l-icon-a fa fa-pencil-square-o"></i>修改
				</button>
				<button id="delete" type="button" class="btn btn-icon"
					onclick="FF_DeletedClickEvent(this)">
					<i class="l-icon l-icon-a fa fa-minus-square-o"></i>删除
				</button>
			</div>
		</div>
		<!-- 表格列表 -->
		<div class="common-table">
			<table id="maingrid" style="margin-left: 0px; width: 100%"></table>
		</div>
	</div>
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel">
		<div class="modal-dialog" role="document" style="width: 60%">
			<div class="modal-content">
				<div class="modal-header" style="background-color: #2e6da4">
					<button type="button" class="close" data-dismiss="modal"
						aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
					<h4 class="modal-title" id="myModalLabel">模板编辑</h4>
				</div>
				<div class="modal-body FrameRightBg">
					<div class="FrameWindow tabFrameWindow">
						<div class="cont-table tab-content">
				<!-- 机构信息 -->
				<div class="tab-pane fade in active" id="mainTab">
					<form onsubmit="return false;" id="mainform" class="table-normal"
						enctype="multipart/form-data">
						<div class="cont-table tab-content" style="width: 98%">
							<table>
								<tbody>
									<tr>
										<input type="hidden" name="SDdetail_id" id="SDdetail_id" >
									</tr>
									<tr>
										<th align="right"><font color="red">*</font>编码：</th>
										<td ><input id="SDdetail_code" name="SDdetail_code"
											class="illegalRequest" type="text" validate="{required:true,minlength:1,maxlength:30}"/></td>
									</tr>
									<tr>
										<th align="right"><font color="red">*</font>名称：</th>
										<td><input maxlength="1000" inputwidth="365" id="SDdetail_name"
											name="SDdetail_name" class="illegalRequest" type="text"
											 validate="{required:true,minlength:6,maxlength:30}"/></td>
									</tr>
									<tr>
										<th align="right"><font color="red">*</font>模板页面：</th>
										<td >
										<input type="hidden" name="viewsId" id="viewsId" >
										<select name="selectviewsId" id="selectviewsId" multiple="multiple" style="width:100%"  size="3">
										</select></td>
									</tr>
									
								</tbody>
							</table>
						</div>
					</form>

				</div>
			</div>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
					<button type="button" class="btn btn-primary"
						onclick="FF_SetDefult()">确定</button>
				</div>
			</div>
		</div>
	</div>
	<script type="text/javascript">
	
	
	var baseUrl = '${baseURL}/report/template/report/reporttemplate';
  function queryParams(params){
	  var queryData = {};    //如果没有额外的查询参数的话就新建一个空对象，如果有的话就先装你的查询参数
      //然后增加这两个
      queryData.perPageSize = params.pageSize;
      queryData.pageNo = params.pageNumber;
      return queryData;    //这个就是向服务端传递的参数对象
	}
  function initTable() {
  		$('#maingrid').bootstrapTable({
  			url:baseUrl+'list/listJSON.do?type=${param.type}',
  			method: 'post',
			contentType: "application/x-www-form-urlencoded",
       		sidePagination: "server",
       		queryParams: queryParams,
       		queryParamsType:"undenfied",
       	 dataField: "Rows",
         totalField:"Total",
         striped: true,                      //是否显示行间隔色
	        pageNumber:1,                       //初始化加载第一页，默认第一页
	     	pagination: true,
	        clickToSelect: true,                //是否启用点击选中行
            uniqueId: "id",                 //每一行的唯一标识，一般为主键列
       		columns: [{
                checkbox: true
            },{
                   field: 'code',
                   title: '编码',
   	               formatter: function (value, row, index) {
   	                   return value;  
   	               }
               }, {
                   field: 'name',
                   title: '名称',
                   formatter: function (value, Rows, index) {
                	   return value;
	               }
			   }, {
                   field: 'id',
                   title: '访问地址',
                   formatter: function (value, Rows, index) {
                	   return "<a href='${baseURL}/report/template/report/reporttemplatelist/listReport.do?id="+value+"'>/report/template/report/reporttemplatelist/listReport.do?id="+value+"</a>";
	               }
			   }],
			   onDblClickRow:function(row){
				   if (row) {
						$("input[name='SDdetail_id']").val(row.id);
						$("input[name='SDdetail_name']").val(row.name);
						$("input[name='SDdetail_code']").val(row.code);
					   	 $('#selectviewsId').multiselect({
					   		 buttonWidth:800,
					   		 nonSelectedText: '请选择' 
					   	});
					   	addOption(row[0].viewsIdDesc);
					} else {
						 $('#selectviewsId').multiselect({
					   		 buttonWidth:800,
					   		 nonSelectedText: '请选择' 
					   	});
					   	addOption();
						$("input[name='SDdetail_id']").val("");
						$("input[name='SDdetail_name']").val("");
						$("input[name='SDdetail_code']").val("");
					}
					$("#myModal").modal();
			   }
  		})
	}
  
   $(function () {
		initTable();
		$("#maingrid").css("text-align","center");
		}) 

   //新增事件
     function FF_AddClickEvent(btnItem){
  		$("input[name='SDdetail_id']").val("");
 		$("input[name='SDdetail_name']").val("");
 		$("input[name='SDdetail_code']").val("");
 		document.getElementById("selectviewsId").options.selectedIndex = 0; //回到初始状态
     	 $('#selectviewsId').multiselect({
     		 buttonWidth:800,
     		 nonSelectedText: '请选择' 
     	});
     	addOption();
     	$("#myModal").modal();
     }
      //修改事件
     function FF_ModifyClickEvent(btnItem){
   		$("input[name='SDdetail_id']").val("");
 		$("input[name='SDdetail_name']").val("");
 		$("input[name='SDdetail_code']").val("");
 		document.getElementById("selectviewsId").options.selectedIndex = 0; //回到初始状态
     	var row = $('#maingrid').bootstrapTable('getSelections');
     	if (row.length == 0) { alert("请先选择需要修改的行!"); return false;}
     	if (row) {
     		$("input[name='SDdetail_id']").val(row[0].id);
     		$("input[name='SDdetail_name']").val(row[0].name);
     		$("input[name='SDdetail_code']").val(row[0].code);
        	$('#selectviewsId').multiselect({
        		 buttonWidth:800,
        		 nonSelectedText: '请选择'/* , //默认显示内容
        		 onDropdownShow: function (event) { 
        	           addOption(row[0].viewsIdDesc);
        	       } */
        	});
         	addOption(row[0].viewsId);
     	} else {
     		$("input[name='SDdetail_id']").val("");
     		$("input[name='SDdetail_name']").val("");
     		$("input[name='SDdetail_code']").val("");
     	}
     	$("#myModal").modal();
     }
      
     //删除事件
     function FF_DeletedClickEvent(btnItem){
    	 var selectedRow = $('#maingrid').bootstrapTable('getSelections');
     	if (!selectedRow || selectedRow.length <= 0) { alert("请选择需要操作的行记录!"); return false;}
     	var ids = BT.serialIdParam(selectedRow,",");
     	 BT.showWarning('确认删除?',function(){
    		 $.ajax({
					type: "post",
					url: baseUrl+"delete/delete.do",
					dataType : "json",
					data: {ids: ids},
					
				success: function(data){
					if(data.hasOk){
						BT.showSuccess('操作成功!',function(){
							FF_Reload();
	    				});
					}else{
						BT.showError("操作失败!失败信息如下:\n" + data.message + "\n如您对以上信息有疑问，请联系管理人员!");
					}
				}
			 });
			});
     }
     //一个重新加载数据方法，该方法主要作为外部框架调用使用
     function FF_Reload(){
    	$("#maingrid").bootstrapTable('refresh');
   	  
     }
     var templateJSON = {};
     function addOption(ids) {
    	 $.ajax({
 			type: "get",
 			url:baseURL + "/report/commsearch/commsearchlist/listJSONDataAll.do",
 			dataType:'json',
 			success:function(data){
 				templateJSON = data;
 				var data = templateJSON;
 	    		var json = [];
 	    		if(!ids || ids == 'null' || ids == undefined){
 	    			for(var index in data){
 	    				var mdata = {value:data[index].id,label:data[index].text};
 	    				json.push(mdata);
 	    			}
 	    		}else{
 	    			var str = ids.split(";");
 	    			for(var index in data){
 	    				var mdata = {};
 	    				mdata = {value:data[index].id,label:data[index].text};
 	    				for(var i in str){
 	    					if(data[index].id == str[i]){
 	    						mdata = {value:data[index].id,label:data[index].text,selected:true};
 	    					}
 	    				}
 	    				json.push(mdata);
 	    			}
 	    		}
 	    		$("select[name='selectviewsId']").multiselect('dataprovider',json);
 			}
 		}) 
    	}

    	 
    	function FF_SetDefult(){

    		 var code = $("#SDdetail_code").val();
    		 var name = $("#SDdetail_name").val();
    		 var remark = $("#SDdetail_remark").val();
    		 var id = $("#SDdetail_id").val();
    		 if(!code || code.length == 0){
    			 BT.showError("请输入编码");
    			 return;
    		 }
    		 if(!name || name.length == 0){
    			 BT.showError("请输入名称");
    			 return;
    		 }
    		 var selectValueStr={id:id , SDdetail_code:code , SDdetail_name : name};
    		 $("#selectviewsId").each(function () {       
    			 selectValueStr.viewsId = $(this).val();
    		 });
    		 $.ajax({
    			type: "POST",
    			url:"${baseURL}/report/template/report/reporttemplatesave/save.do",
    			dataType:'json',
    			data:selectValueStr,
    			success:function(data){
    				if(data.hasOk){
    					BT.showSuccess('操作成功!',function(){
    					// 关闭窗口 刷新父窗口
    						$("#myModal").modal('hide');
    						FF_Reload();
    				});
    				}else{
    					BT.showError("操作失败!失败信息如下:\n" + data.message + "\n如您对以上信息有疑问，请联系管理人员!");
    				}
    			}
    		})  
    		}
    	 
  </script>
</body>
  </html>
